<template>
  <div class="app-container">
    <Find :OriginalFilter="{ static: true }" :formList="formList" />
    <div class="container mt24 flex">
      <el-card shadow="never" :body-style="{ padding: '12px 20px 12px' }">
        <div slot=" header" class="mb9 f16">
          <span style="font-weight: 600">面底配套状况</span>
        </div>
        <Table :tableData="tableData" :tableHeader="tableHeader" :TableHeight="550" />
      </el-card>

      <el-card shadow="never" :body-style="{ padding: '12px 20px 12px' }">
        <div slot="header" class="mb9 f16">
          <span style="font-weight: 600">面底配套明细</span>
        </div>
        <Table :tableData="tableData2" :tableHeader="tableHeader2" :TableHeight="550" />

        <div class="btns">
          <el-button class="bg" type="primary" size="default" @click="">保存</el-button>
          <el-button type="primary" size="default" @click="">打印</el-button>
        </div>
      </el-card>
    </div>
  </div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'FaceBottomMatchingQueryLp'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
const formList = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '导出配套资料(号码)'
  },
  {
    type: 'button',
    checkboxLabel: '导出日常报表'
  },
  {
    type: 'checkbox',
    checkboxLabel: '鞋面已配套',
    checked: false
  },
  {
    type: 'checkbox',
    checkboxLabel: '大底已配套',
    checked: false
  },
  {
    type: 'checkbox',
    checkboxLabel: '鞋垫已配套',
    checked: false
  },
  {
    type: 'checkbox',
    checkboxLabel: '中底板已配套',
    checked: false
  }
])

const tableHeader = ref([
  {
    label: '指令',
    prop: 'instruction'
  },
  {
    label: '型体',
    prop: 'shape',
    sortable: true
  },
  {
    label: '型体数量',
    prop: 'shapeNum'
  },
  {
    label: '鞋面已发',
    prop: 'upper'
  },
  {
    label: '鞋面库存',
    prop: 'upperStock',
    sortable: true
  },
  {
    label: '大底库存',
    prop: 'soleStock',
    sortable: true
  },
  {
    label: '鞋垫库存',
    prop: 'insoleStock',
    sortable: true
  },
  {
    label: '鞋带库存',
    prop: 'shoelaceStock',
    sortable: true
  },
  {
    label: '配套库存',
    prop: 'matchingStock',
    sortable: true
  }
])
const tableData = ref([
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  },
  {
    instruction: '指令1',
    shape: '型体1',
    shapeNum: '1',
    upper: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    matchingStock: '1'
  }
])

const tableHeader2 = ref([
  {
    label: '号码',
    prop: 'number'
  },
  {
    label: '订单数量',
    prop: 'orderNum'
  },
  {
    label: '鞋面库存',
    prop: 'upperStock'
  },
  {
    label: '大底库存',
    prop: 'soleStock'
  },
  {
    label: '鞋垫库存',
    prop: 'insoleStock'
  },
  {
    label: '鞋带库存',
    prop: 'shoelaceStock'
  },
  {
    label: '中底库存',
    prop: 'midsoleStock'
  },
  {
    label: '配套数量',
    prop: 'matchingNum'
  }
])
const tableData2 = ref([
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  },
  {
    number: '1',
    orderNum: '1',
    upperStock: '1',
    soleStock: '1',
    insoleStock: '1',
    shoelaceStock: '1',
    midsoleStock: '1',
    matchingNum: '1'
  }
])
</script>

<style lang="less" scoped>
.btns {
  display: flex;
  justify-content: end;
  margin: 25px 20px 10px;

  .bg {
    background-color: #e7e7e7;
    border: 1px solid #e7e7e7;
    color: #000000;
  }
}
</style>
